<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@page pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
	<meta charset="UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<meta name="description" content="">
	<meta name="author" content="">
	
	<link rel="stylesheet" href="${APP_PATH}/bootstrap/css/bootstrap.min.css">
	<link rel="stylesheet" href="${APP_PATH}/css/backstage/font-awesome.min.css">
	<link rel="stylesheet" href="${APP_PATH}/css/backstage/main.css">
	<style>
		.tree li {
			list-style-type: none;
			cursor:pointer;
		}
		table tbody tr:nth-child(odd){background:#F4F4F4;}
		table tbody td:nth-child(even){color:#C00;}
	</style>
</head>

<body class="container">

<div class="container-fluid">
	<div class="row">
			<div class="panel panel-default">
				<div class="panel-heading">
					<h3 class="panel-title"><i class="glyphicon glyphicon-th"></i> 数据列表</h3>
				</div>
				<input type="hidden" id="identity" value="${identity}">
				<div class="panel-body">
					<form class="form-inline" role="form" style="float:left;">
						<div class="form-group has-feedback">
							<div class="input-group">
								<div class="input-group-addon">查询条件</div>
								<input id="queryText" class="form-control has-success" type="text" placeholder="请输入查询条件">
							</div>
						</div>
						<button id="queryBtn" type="button" class="btn btn-warning"><i class="glyphicon glyphicon-search"></i> 查询</button>
					</form>
					<c:if test="${identity==0}">
						<button type="button" class="btn btn-danger" onclick="deleteUsers()" style="float:right;margin-left:10px;"><i class=" glyphicon glyphicon-remove"></i> 删除</button>
						<button type="button" class="btn btn-primary" style="float:right;" onclick='window.location.href="${APP_PATH}/user/add"'><i class="glyphicon glyphicon-plus"></i> 新增</button>
					</c:if>
					<br>
					<hr style="clear:both;">
					<div class="table-responsive">
						<form id="userForm">
							<table class="table  table-bordered">
								<thead>
								<tr >
									<th width="30">#</th>
									<th width="30"><input type="checkbox" id="allSelBox"></th>
									<th>账号</th>
									<th>名称</th>
									<th>邮箱地址</th>
									<th width="100">操作</th>
								</tr>
								</thead>
								
								<tbody id="userData">
								
								</tbody>
								
								<tfoot>
								<tr >
									<td colspan="6" align="center">
										<ul class="pagination">
										
										</ul>
									</td>
								</tr>
								
								</tfoot>
							</table>
						</form>
					</div>
				</div>
			</div>
		</div>
	</div>
</div>

<script src="${APP_PATH}/jquery/jquery-2.1.1.min.js"></script>
<script src="${APP_PATH}/bootstrap/js/bootstrap.min.js"></script>
<script src="${APP_PATH}/script/docs.min.js"></script>
<script src="${APP_PATH}/layer/layer.js"></script>
<script type="text/javascript">
	var likeflg = false;
	var identity = $("#identity").val();
	$(function () {
		$(".list-group-item").click(function(){
			if ( $(this).find("ul") ) {
				$(this).toggleClass("tree-closed");
				if ( $(this).hasClass("tree-closed") ) {
					$("ul", this).hide("fast");
				} else {
					$("ul", this).show("fast");
				}
			}
		});
		
		pageQuery(1);
		
		$("#queryBtn").click(function(){
			var queryText = $("#queryText").val();
			if (queryText == "") {
				likeflg = false;
			} else {
				likeflg = true;
			}
			pageQuery(1);
		});
		
		$("#allSelBox").click(function(){
			var flg = this.checked;

			$("#userData :checkbox").each(function(){
				this.checked = flg;
			});
		});
	});
	// $("tbody .btn-success").click(function(){
	// 	window.location.href = "assignRole.html";
	// });
	// $("tbody .btn-primary").click(function(){
	// 	window.location.href = "edit.html";
	// });
		//分页查询
	function pageQuery( pageno ) {
		var loadingIndex = null;
		var jsonData={
			"currentPageNo":pageno,
			"pageSize":5,
			"identity":identity
		}
		if (likeflg == true){
			jsonData.queryText=$("#queryText").val();
		}
		$.ajax({
			type:"post",
			url:"${APP_PATH}/user/index",
			data:jsonData,
			dataType:"json",
			beforeSend:function (){
				loadingIndex = layer.msg('处理中', {icon: 16});
			},
			success:function (result){
				layer.close(loadingIndex);
				// 局部刷新页面数据
				if (result.success){
					var tableContent = "";
					var pageContent = "";
					var userPage = result.data;
					var userPages = userPage.datas;
					$.each(userPages, function(i,user){
						tableContent += '<tr>';
						tableContent += '  <td>'+(i+1)+'</td>';
						tableContent += '  <td><input type="checkbox" name="userid" value="'+user.id+'"></td>';
						tableContent += '  <td>'+user.loginacct+'</td>';
						tableContent += '  <td>'+user.username+'</td>';
						tableContent += '  <td>'+user.email+'</td>';
						tableContent += '  <td>';
						tableContent += '     <button type="button" onclick="goUpdatePage('+user.id+')" class="btn btn-primary btn-xs"><i class=" glyphicon glyphicon-pencil"></i></button>';
						if (identity==0){
							tableContent += '     <button type="button" onclick="goAssignPage('+user.id+')" class="btn btn-success btn-xs"><i class=" glyphicon glyphicon-check"></i></button>';
							tableContent += '	  <button type="button" onclick="deleteUser('+user.id+', \''+user.loginacct+'\')" class="btn btn-danger btn-xs"><i class=" glyphicon glyphicon-remove"></i></button>';
						}
						tableContent += '  </td>';
						tableContent += '</tr>';
					});
					if ( pageno > 1 ) {
						pageContent += '<li><a href="#" onclick="pageQuery('+(pageno-1)+')">上一页</a></li>';
					}
					for ( var i = 1; i <= userPage.totalPageCount; i++ ) {
						if ( i == pageno ) {
							pageContent += '<li><a class="active" href="#" onclick="pageQuery('+i+')">'+i+'</a></li>';
						} else {
							pageContent += '<li><a href="#" onclick="pageQuery('+i+')">'+i+'</a></li>';
						}
					}
					if ( pageno < userPage.totalPageCount ) {
						pageContent += '<li><a href="#" onclick="pageQuery('+(pageno+1)+')">下一页</a></li>';
					}
					$("#userData").html(tableContent);
					$(".pagination").html(pageContent);
					}
				}
			});
		}
		function goAssignPage(id){
			window.location.href="${APP_PATH}/user/assign/"+id;
		}
		function goUpdatePage(id){
			window.location.href="${APP_PATH}/user/edit/"+id;
		}
		//批量删除
		function deleteUsers(){
			var loadingIndex = null;
			layer.confirm("请确认是否删除选中内容",  {icon: 3, title:'提示'}, function(cindex){
			$.ajax({
				type:"post",
				url:"${APP_PATH}/user/deleteUsers",
				//取多个值
				data:$("#userForm").serialize(),
				beforeSend : function(){
					loadingIndex = layer.msg('处理中', {icon: 16});
				},
				success:function (result){
					layer.close(loadingIndex);
					if (result.success){
						pageQuery(1);
					}else{
						layer.msg("删除失败！", {time:2000, icon:5, shift:6}, function(){
						});
					}
				}
			});
			});
		}
		//删除单个用户
		function deleteUser(id,loginacct){
				var loadingIndex = null;
				layer.confirm("删除用户信息【"+loginacct+"】, 是否继续",  {icon: 3, title:'提示'}, function(cindex){
				$.ajax({
					type:"POST",
					url:"${APP_PATH}/user/delete",
					data:{ id:id },
					beforeSend:function (){
						loadingIndex = layer.msg('处理中', {icon: 16});
					},
					success:function (result){
						layer.close(loadingIndex);
						if(result.success){
							pageQuery(1);
						}else{
							layer.msg("删除失败！", {time:2000, icon:5, shift:6}, function(){
							});
						}
					}
				});
			});
		}
</script>
</body>
</html>
